import React from 'react';
import { router, withRouter } from 'umi';
import { message } from 'antd';
import moment from 'moment';
import { useRequest, defaultFormatResult } from '@/hooks';
import { InterviewBoxPc, Calendar, ButtonPc as Button } from '@/pages/RecruitEmail/pc/components';
// import { useCompanyName } from '@/pages/Recruitment/RecruitEmail/hooks';
import { getInterviewRangeMap, changeInterview } from '@/pages/RecruitEmail/service/interview';
import Pic from '@/pages/RecruitEmail/images/interview-bg-new.png';
import styles from './index.less';

const InterviewUpdate = ({ location }) => {
    const { query } = location;
    const calendarRef = React.useRef(null);

    // const { data: companyName } = useCompanyName(query?.id);

    const { data: rangeMap } = useRequest(() => getInterviewRangeMap(query?.nid), {
        refreshDeps: [query?.nid],
        ready: !!query?.nid,
        ...defaultFormatResult
    });

    const { loading: submitLoading, run: submit } = useRequest(changeInterview, {
        manual: true,
        onSuccess: res => {
            const { code, msg } = res;
            if (code === 10000) {
                message.success('操作成功');
                history.goBack();
                return;
            }
            message.error(msg);
        }
    });

    // 提交
    const handleSubmit = async () => {
        const [, v] = calendarRef.current.submit();
        // if (err) {
        //     message.error('日程冲突，请重新选择时间');
        //     return;
        // }
        if (v && v.length > 0) {
            const finalList = v.sort((a, b) => {
                if (moment(a.startTime).isAfter(b.startTime)) {
                    return 1;
                }
                return -1;
            });
            // console.log('final', v);
            if (query?.nid) {
                submit(finalList, query?.nid);
            }
        } else {
            message.error('请先选择面试时间');
        }
    };

    return (
        <div className={styles.interviewPc}>
            <InterviewBoxPc
                titleProps={{
                    title: '修改后的面试将通过邮件再次通知！',
                    content: '请修改您方便的面试时间',
                    src: Pic,
                    picStyle: { marginBottom: 27, marginLeft: 200, marginTop: 24 },
                    wrap: true,
                    showStep: false
                }}
                boxProps={{ style: { padding: '32px 24px' } }}
                showTip={false}
            >
                <div id="calendar" className={styles.contMain}>
                    <div className={styles.interviewMain}>
                        {/* <div className={styles.ask}>请修改您方便的面试时间</div>
                        <div className={styles.makeSure}>
                            面试时间需等待HR确认最终结果, 修改后的面试将通过邮件再次通知！
                        </div> */}
                        <Calendar ref={calendarRef} staticRangeMap={rangeMap} />
                    </div>
                    <div className={styles.interFooter}>
                        <Button
                            className={styles.interviewSubmit}
                            style={{ marginRight: 20 }}
                            onClick={() => history.goBack()}
                        >
                            取消
                        </Button>
                        <Button
                            type="primary"
                            className={styles.interviewSubmit}
                            loading={submitLoading}
                            onClick={handleSubmit}
                        >
                            提交
                        </Button>
                    </div>
                </div>
            </InterviewBoxPc>
        </div>
    );
};

export default withRouter(InterviewUpdate);
